/* reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, nav ul, nav li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video
{
    border-style: none;
    border-color: inherit;
    border-width: 0;
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline;
    text-align: left;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section
{
    display: block;
}
ol, ul
{
    list-style: none;
    margin: 0px;
    padding: 0px;
}
blockquote, q
{
    quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after
{
    content: '';
    content: none;
}
table
{
    border-collapse: collapse;
    border-spacing: 0;
}
/* start editing from here */
a
{
    text-decoration: none;
}
.txt-rt
{
    text-align: right;
}
/* text align right */
.txt-lt
{
    text-align: left;
}
/* text align left */
.txt-center
{
    text-align: center;
}
/* text align center */
.float-rt
{
    float: right;
}
/* float right */
.float-lt
{
    float: left;
}
/* float left */
.clear
{
    clear: both;
}
/* clear float */
.pos-relative
{
    position: relative;
}
/* Position Relative */
.pos-absolute
{
    position: absolute;
}
/* Position Absolute */
.vertical-base
{
    vertical-align: baseline;
}
/* vertical align baseline */
.vertical-top
{
    vertical-align: top;
}
/* vertical align top */
nav.vertical ul li
{
    display: block;
}
/* vertical menu */
nav.horizontal ul li
{
    display: inline-block;
}
/* horizontal menu */
img
{
    max-width: 100%;
}
/*end reset*/
body
{
    font-family: Arial;
    background: #F6F6F6;
}



.wrap
{
    width: 80%;
    margin: 0 auto;
}
/*---start-header----*/
.top-header
{
    background: #FFF;
    padding: 1em 0;
}
.top-header-left
{
    float: left;
}
.top-header-left p
{
    font-family: 'Open Sans' , sans-serif;
    color: #007DAD;
    font-size: 0.875em;
    background: url(../images/phone.png) no-repeat;
    padding-left: 18px;
}
.right-left
{
    float: right;
}
.right-left ul li
{
    display: inline-block;
}
.right-left ul li a
{
    font-family: 'Open Sans' , sans-serif;
    color: #007DAD;
    font-size: 0.875em;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}
.right-left ul li a:hover
{
    color: #303030;
}
/*---start-main-header----*/
.main-header
{
    padding: 1.7em 0 1.5em 0;
    background: #F6F6F6;
}
.logo
{
    float: left;
}
.logo img
{
    display: block;
    width:80%;
}
.social-links
{
    float: right;
}
.social-links ul li
{
    display: inline-block;
}
.social-links img
{
    display: block;
}
.login-content
{
    font-family: 'Open Sans' , sans-serif;
    color: rgba(31, 31, 31, 0.99);
    font-size: 1em;
    text-transform: none;
    margin: 0 auto;
}

.login
{
    background: url(../images/lock.png) no-repeat 0;
    padding-left: 18px;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}
.login:hover
{
    background: url(../images/lock1.png) no-repeat 0;
}
.banner
{
    display: block;
    margin: 0 auto;
}
.sign
{
    background: url(../images/login.png) no-repeat 0;
    padding-left: 18px;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}
.sign:hover
{
    background: url(../images/login1.png) no-repeat 0;
}
/*---start-top-nav----*/
.top-nav
{
    background: #007DAD;
    height:50px;
}
.top-nav ul li
{
    display: inline-block;
    float: left;
    border-left: 1px ridge #1087B4;
}
.top-nav ul li:nth-child(1)
{
    border: none;
}
.top-nav li.active > a, .top-nav li > a:hover
{
    color: #FFF;
    background: rgba(31, 31, 31, 0.99);
}
.top-nav li a
{
    font-size: 1em;
    font-family: 'Open Sans' , sans-serif;
    color: #FFF;
    background: #007DAD;
    text-transform: uppercase;
    padding: 1em 2em;
    display: block;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}

.top-nav ul li a ul li
{
    width:100%;
}
/*----start-content-----*/
.content-top-grid
{
    float: left;
    width: 33.33%;
}
.content-top-grid-pic
{
    float: left;
    width: 20%;
}
.content-top-grid-title
{
    float: right;
    width: 78%;
}
.content-top-grid-title h3
{
    font-family: 'Open Sans' , sans-serif;
    color: rgba(31, 31, 31, 0.99);
    font-size: 2em;
    text-transform: uppercase;
    margin-top: 0.8em;
}
.content-top-grid p
{
    font-size: 0.875em;
    line-height: 1.5em;
    color: #777;
    font-family: 'Open Sans' , sans-serif;
    width: 90%;
    padding: 0.5em 0;
}
.grid-button
{
    font-family: 'Open Sans' , sans-serif;
    color: #007DAD;
    text-transform: uppercase;
    margin: 0.5em 0;
    display: block;
    background: url(../images/marker.png) no-repeat 0;
    padding: 0px 0px 0px 20px;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}
.grid-button:hover
{
    color: #303030;
    background: url(../images/marker1.png) no-repeat 0;
}
.content-top-grids
{
    padding: 1.7em 0 1.5em 0;
    background: #FFF;
}
/*---boxs----*/
/*  GRID OF THREE   ============================================================================= */
.section
{
    clear: both;
    padding: 0px;
    margin: 0px;
}
.group:before, .group:after
{
    content: "";
    display: table;
}
.group:after
{
    clear: both;
}
.group
{
    zoom: 1;
}
.grid_1_of_3
{
    display: block;
    float: left;
    margin: 1% 0 1% 1.6%;
}
.grid_1_of_3:first-child
{
    margin-left: 0;
}
.images_1_of_3
{
    width: 32.2%;
    padding: 1.5% 0;
}
.images_1_of_3 img
{
    max-width: 100%;
    display: block;
}
.images_1_of_3 h3
{
    font-family: 'Open Sans' , sans-serif;
    color: rgba(31, 31, 31, 0.99);
    font-size: 2em;
    text-transform: uppercase;
    margin: 0.3em 0;
}
.images_1_of_3 span
{
    display: block;
    font-family: 'Open Sans' , sans-serif;
    font-size: 1em;
    color: #007DAD;
    padding: 2px 0px 1px 0px;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}
.images_1_of_3 ul li a
{
    display: block;
    font-family: 'Open Sans' , sans-serif;
    font-size: 1em;
    color: #007DAD;
    padding: 2px 0px 5px 0px;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}
.images_1_of_3 ul li a:hover
{
    color: #777;
}
.images_1_of_3 ul li
{
    border-bottom: 1px dashed rgba(192, 192, 192, 0.33);
    background: url(../images/marker02.png) 0 19px no-repeat;
    padding: 9px 10px 8px 18px;
}
.images_1_of_3 ul li:hover
{
    background: url(../images/marker020.png) 0 19px no-repeat;
}
.images_1_of_3 p
{
    font-size: 0.875em;
    line-height: 1.5em;
    color: #777;
    font-family: 'Open Sans' , sans-serif;
    width: 90%;
    padding: 0.5em 0;
}
.images_1_of_3 .button
{
    margin-top: .3em;
    line-height: 1.9em;
}
.images_1_of_3 .button a
{
    font-family: 'Open Sans' , sans-serif;
    color: #007DAD;
    text-transform: uppercase;
    margin: 0.5em 0;
    display: block;
    background: url(../images/marker.png) no-repeat 0;
    padding: 0px 0px 0px 20px;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}
.images_1_of_3 .button a:hover
{
    color: #303030;
    background: url(../images/marker1.png) no-repeat 0;
}

/***** Media Quries *****/
@media only screen and (max-width: 1024px)
{
    .wrap
    {
        width: 90%;
    }
}
/*  GO FULL WIDTH AT LESS THAN 640 PIXELS */
@media only screen and (max-width: 640px)
{

    .wrap
    {
        width: 95%;
    }
    .grid_1_of_3
    {
        margin: 2% 0 2% 0%;
    }

    .images_1_of_3
    {
        width: 94%;
        padding: 3%;
    }
}

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px)
{

    .wrap
    {
        width: 95%;
    }
    .grid_1_of_3
    {
        margin: 2% 0 2% 0%;
    }
    .images_1_of_3
    {
        width: 92%;
        padding: 4%;
    }
}
/*---start-footer----*/
.footer
{
    padding: 2em 0 1em 0;
    background: #303030;
}
.footer-grid
{
    float: left;
    width: 20%;
    border-left: 1px solid rgba(153, 153, 153, 0.13);
    padding: 0px 29px;
}
.footer-grid:first-child
{
    border: none;
}
.footer-grid ul li a, .footer-grid p
{
    color: #858484;
    font-size: 0.875em;
    font-family: 'Open Sans' , sans-serif;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
    padding: 0.3em 0;
    display: block;
}
.footer-grid span
{
    font-size: 1.2em;
    font-family: 'Open Sans' , sans-serif;
    color: #007DAD;
}
.footer-grid ul li a:hover
{
    color: #007DAD;
}
.footer-grid h3
{
    font-family: 'Open Sans' , sans-serif;
    color: #FFF;
    font-size: 1.2em;
    text-transform: uppercase;
    margin: 0.2em 0 0.3em 0;
}
/*----copy-tight-----*/
.copy-tight
{
    text-align: center;
    padding: 1em 0 0 0;
    border-top: 1px solid rgba(153, 153, 153, 0.13);
    margin-top: 1em;
}
.copy-tight p
{
    color: #858484;
    font-size: 0.875em;
    font-family: 'Open Sans' , sans-serif;
    padding: 0.3em 0;
    display: block;
}
.copy-tight p a
{
    color: #FFF;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}
.copy-tight p a:hover
{
    color: #007DAD;
}
/*---start-about----*/
.about-topgrid1
{
    width: 29%;
    float: left;
    margin-right: 5%;
}
.about h5
{
    color: #000;
    font-family: 'Open Sans' , sans-serif;
    font-size: 30px;
    padding: 10px 0px;
}
.about-topgrid1 h3
{
    font-size: 1.5em;
    color: rgba(31, 31, 31, 0.99);
    border-bottom: 1px solid rgba(192, 192, 192, 0.18);
    font-family: 'Open Sans' , sans-serif;
    padding: 15px 0px 15px 0px;
    margin-bottom: 13px;
    text-transform: uppercase;
}
.about-topgrid1 h4
{
    font-size: 1em;
    color: rgba(31, 31, 31, 0.99);
    font-family: 'Open Sans' , sans-serif;
    padding: 10px 0px 0px 0px;
}
.about-topgrid1 p
{
    line-height: 1.5em;
    padding: 4px 0px 8px 0px;
    font-family: 'Open Sans' , sans-serif;
    font-size: 0.9em;
    color: #777;
}
/*----about-histore----*/
.about-histore
{
    float: left;
    width: 30%;
}
.about-histore h3
{
    font-size: 1.5em;
    color: rgba(31, 31, 31, 0.99);
    border-bottom: 1px solid rgba(192, 192, 192, 0.18);
    font-family: 'Open Sans' , sans-serif;
    padding: 15px 0px 9px 0px;
    margin-bottom: 13px;
    text-transform: uppercase;
}
.about-histore ul li span
{
    color: rgba(31, 31, 31, 0.99);
    font-family: 'Open Sans' , sans-serif;
    font-size: 14px;
    padding: 15px 0px 15px 0px;
    margin-bottom: 13px;
    float: left;
    width: 15%;
}
.about-histore ul li p
{
    line-height: 1.5em;
    padding: 4px 0px 8px 0px;
    font-family: 'Open Sans' , sans-serif;
    font-size: 0.9em;
    color: #777;
    float: right;
    width: 83%;
}
/*----about-services---*/
.about-services h3
{
    font-size: 1.5em;
    color: rgba(31, 31, 31, 0.99);
    border-bottom: 1px solid rgba(192, 192, 192, 0.18);
    font-family: 'Open Sans' , sans-serif;
    padding: 15px 0px 9px 0px;
    margin-bottom: 13px;
    text-transform: uppercase;
}
.about-services h4
{
    font-size: 1em;
    color: rgba(31, 31, 31, 0.99);
    font-family: 'Open Sans' , sans-serif;
    padding: 10px 0px 0px 0px;
}
.about-services p
{
    line-height: 1.5em;
    padding: 4px 0px 8px 0px;
    font-family: 'Open Sans' , sans-serif;
    font-size: 0.9em;
    color: #777;
}
.about-services ul li a img
{
    vertical-align: middle;
}
.about-services
{
    width: 30%;
    float: left;
    margin-left: 5%;
}
.about-services ul li a
{
    display: block;
    font-family: 'Open Sans' , sans-serif;
    font-size: 1em;
    color: #007DAD;
    padding: 2px 0px 5px 0px;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}
.about-services ul li a:hover
{
    color: #777;
}
.about-services ul li
{
    border-bottom: 1px dashed rgba(192, 192, 192, 0.33);
    background: url(../images/marker02.png) 0 19px no-repeat;
    padding: 9px 10px 8px 18px;
}
.about-services ul li:hover
{
    background: url(../images/marker020.png) 0 19px no-repeat;
}
/*---our team---*/
.ourteam h3
{
    font-size: 1.5em;
    color: rgba(31, 31, 31, 0.99);
    border-bottom: 1px solid rgba(192, 192, 192, 0.18);
    font-family: 'Open Sans' , sans-serif;
    padding: 15px 0px 10px 0px;
    margin-bottom: 10px;
    text-transform: uppercase;
}
/*  GRID OF Four   ============================================================================= */
.section
{
    clear: both;
    padding: 0px;
    margin: 0px;
}
.group:before, .group:after
{
    content: "";
    display: table;
}
.group:after
{
    clear: both;
}
.group
{
    zoom: 1;
}
.grid_1_of_4
{
    display: block;
    float: left;
    margin: 0% 0 1% 1.6%;
}
.grid_1_of_4:first-child
{
    margin-left: 0;
}
.images_1_of_4
{
    width: 23.8%;
    padding: 1% 0% 1.5% 0px;
}
.images_1_of_4 img
{
    max-width: 100%;
    display: block;
}
.images_1_of_4 h3
{
    display: block;
    font-family: 'Open Sans' , sans-serif;
    font-size: 1em;
    color: #007DAD;
    padding: 8px 0px 8px 0px;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
    text-transform: uppercase;
}
.images_1_of_4 p
{
    line-height: 1.5em;
    padding: 4px 0px 8px 0px;
    font-family: 'Open Sans' , sans-serif;
    font-size: 0.9em;
    color: #777;
}
.images_1_of_4 p a
{
    color: #007DAD;
}
.images_1_of_4 p a:hover
{
    color: #797979;
}
.images_1_of_4 .button
{
    margin-top: .3em;
    line-height: 1.9em;
}
.images_1_of_4 .button a
{
    padding: 6px 10px;
    font-size: 0.8em;
    font-family: Arial, "Helvetica Neue" , "Helvetica" , Tahoma, Verdana, sans-serif;
    border: 1px solid rgba(0,0,0,0.1);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.7);
    background: #3f4040;
    color: #fff;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 0 1px rgba(255, 255, 255, 0.2) inset, 0 2px 2px -1px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 1px rgba(255,255,255,0.2) inset, 0 2px 2px -1px rgba(0,0,0,0.3);
    box-shadow: 0 1px rgba(255, 255, 255, 0.2) inset, 0 2px 2px -1px rgba(0, 0, 0, 0.3);
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}
.images_1_of_4 .button a:hover
{
    border: 1px solid #303030;
    background: #525252;
    text-decoration: none;
}

/***** Media Quries *****/
@media only screen and (max-width: 1024px)
{
    .wrap
    {
        width: 90%;
    }
}
/*  GO FULL WIDTH AT LESS THAN 640 PIXELS */
@media only screen and (max-width: 640px)
{

    .wrap
    {
        width: 95%;
    }
    .grid_1_of_4
    {
        margin: 2% 0 2% 0%;
    }
    .images_1_of_4
    {
        width: 94%;
        padding: 3%;
    }
}

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px)
{

    .wrap
    {
        width: 95%;
    }
    .grid_1_of_4
    {
        margin: 2% 0 2% 0%;
    }
    .images_1_of_4
    {
        width: 92%;
        padding: 4%;
    }
}
/*------start-services-----*/
.services1 h4
{
    font-size: 1.5em;
    color: rgba(31, 31, 31, 0.99);
    font-family: 'Open Sans' , sans-serif;
    padding: 30px 0px 0px 0px;
    margin-bottom: 13px;
    text-transform: uppercase;
}
.services-grids
{
    background: none;
    padding: 0.5em 0 2em 0;
}
.services-grid1
{
    margin: 0px 0px 1em 0;
}
.services-grid1 h3
{
    font-size: 1.5em;
    padding-top: 0.3em;
}
/*---start-news-----*/
/*---services----*/
.services
{
    margin-bottom: 4em;
}
.service-content h3
{
    font-size: 1.5em;
    color: rgba(31, 31, 31, 0.99);
    border-bottom: 1px solid rgba(192, 192, 192, 0.18);
    font-family: 'Open Sans' , sans-serif;
    padding: 15px 0px 10px 0px;
    margin-bottom: 10px;
    text-transform: uppercase;
}
.service-content ul li
{
    display: block;
}
.service-content ul li span
{
    width: 5%;
    float: left;
    font-size: 3em;
    color: rgba(31, 31, 31, 0.99);
    font-family: 'Open Sans' , sans-serif;
}
.service-content ul li p
{
    float: right;
    width: 94.5%;
    display: block;
    font-family: 'Open Sans' , sans-serif;
    font-size: 1em;
    color: #777;
    padding: 2px 0px 5px 0px;
    line-height: 1.7em;
}
.service-content ul li p a
{
    font-size: 1.2em;
    color: #007DAD;
    font-family: 'Open Sans' , sans-serif;
    display: block;
}
.service-content
{
    float: left;
    width: 74.5%;
}
.service-content ul
{
    padding-bottom: 5px;
}
.services-sidebar
{
    float: right;
    width: 23%;
}
.services-sidebar h3
{
    font-size: 1.5em;
    color: rgba(31, 31, 31, 0.99);
    border-bottom: 1px solid rgba(192, 192, 192, 0.18);
    font-family: 'Open Sans' , sans-serif;
    padding: 15px 0px 10px 0px;
    margin-bottom: 10px;
}
.services-sidebar ul li a
{
    display: block;
    font-family: 'Open Sans' , sans-serif;
    font-size: 1em;
    color: #007DAD;
    padding: 2px 0px 5px 0px;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}
.services-sidebar ul li a:hover
{
    color: #777;
}
.services-sidebar ul li
{
    border-bottom: 1px dashed rgba(192, 192, 192, 0.33);
    background: url(../images/marker02.png) 0 19px no-repeat;
    padding: 9px 10px 8px 18px;
}
.services-sidebar ul li:hover
{
    background: url(../images/marker020.png) 0 19px no-repeat;
}
/*  Contact Form  ============================================================================= */
.section
{
    clear: both;
    padding: 0px;
    margin: 0px;
}
.group:before, .group:after
{
    content: "";
    display: table;
}
.group:after
{
    clear: both;
}
.group
{
    zoom: 1;
}
.col
{
    display: block;
    float: left;
    margin: 1% 0 1% 1.6%;
}
.col:first-child
{
    margin-left: 0;
}
.span_2_of_3
{
    width: 63.1%;
    padding: 1.5%;
}
.span_1_of_3
{
    width: 29%;
    padding: 1.5%;
}
.span_2_of_3 h3, .span_1_of_3 h3
{
    font-size: 1.5em;
    color: rgba(31, 31, 31, 0.99);
    border-bottom: 1px solid rgba(192, 192, 192, 0.18);
    font-family: 'Open Sans' , sans-serif;
    padding: 0px 0px 10px 0px;
    margin-bottom: 10px;
    text-transform: uppercase;
}
.contact-form
{
    position: relative;
    padding-bottom: 30px;
}
.contact-form div
{
    padding: 5px 0;
}
.contact-form span
{
    display: block;
    font-family: 'Open Sans' , sans-serif;
    font-size: 1em;
    color: #777;
    padding: 2px 0px 5px 0px;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}
.contact-form input[type="text"], .contact-form textarea
{
    padding: 8px;
    display: block;
    width: 98%;
    border: none;
    outline: none;
    font-family: 'Open Sans' , sans-serif;
    font-size: 1em;
    color: #777;
    -webkit-appearance: none;
}
.contact-form textarea
{
    resize: none;
    height: 120px;
}
.contact-form input[type="submit"]
{
    font-family: 'Open Sans' , sans-serif;
    color: #007DAD;
    text-transform: uppercase;
    margin: 0.5em 0;
    display: block;
    background: url(../images/marker.png) no-repeat 0;
    padding: 0px 0px 0px 20px;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
    cursor: pointer;
    border: none;
    font-size: 1em;
}
.contact-form input[type="submit"]:hover
{
    color: #303030;
    background: url(../images/marker1.png) no-repeat 0;
}
.contact-form input[type="submit"]:active
{
    color: #303030;
    background: url(../images/marker1.png) no-repeat 0;
}
.company_address
{
    padding-top: 26px;
}
.company_address p
{
    display: block;
    font-family: 'Open Sans' , sans-serif;
    font-size: 1em;
    color: #777;
    padding: 2px 0px 5px 0px;
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
    -webkit-transition: 0.5s ease;
}
.company_address p span
{
    text-decoration: underline;
    color: rgba(31, 31, 31, 0.99);
    cursor: pointer;
}
.map
{
    margin-bottom: 15px;
}

/***** Media Quries *****/
@media only screen and (max-width: 1024px)
{
    .wrap
    {
        width: 95%;
    }
}
/*  GO FULL WIDTH AT LESS THAN 800 PIXELS */

@media only screen and (max-width: 800px)
{
    .wrap
    {
        width: 95%;
    }
    .span_2_of_3
    {
        width: 94%;
        padding: 3%;
    }
    .col
    {
        margin: 1% 0 1% 0%;
    }
    .span_1_of_3
    {
        width: 94%;
        padding: 3%;
    }
}

/*  GO FULL WIDTH AT LESS THAN 640 PIXELS */

@media only screen and (max-width: 640px) and (min-width: 480px)
{
    .wrap
    {
        width: 95%;
    }
    .span_2_of_3
    {
        width: 94%;
        padding: 3%;
    }
    .col
    {
        margin: 1% 0 1% 0%;
    }
    .span_1_of_3
    {
        width: 94%;
        padding: 3%;
    }

    .contact-form input[type="text"], .contact-form textarea
    {
        width: 97%;
    }
}
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 480px)
{
    .wrap
    {
        width: 95%;
    }
    .span_2_of_3
    {
        width: 90%;
        padding: 5%;
    }
    .col
    {
        margin: 1% 0 1% 0%;
    }
    .span_1_of_3
    {
        width: 90%;
        padding: 5%;
    }
    .contact-form input[type="text"], .contact-form textarea
    {
        width: 92%;
    }
}
/*----responsive-design-----*/
@media only screen and (max-width: 1366px) and (min-width: 1280px)
{
    .wrap
    {
        width: 90%;
    }
}
@media only screen and (max-width: 1280px) and (min-width: 1024px)
{
    .wrap
    {
        width: 90%;
    }
    .footer-grid
    {
        padding: 0px 27px;
    }
}
@media only screen and (max-width: 1024px) and (min-width: 768px)
{
    .wrap
    {
        width: 90%;
    }
    .footer-grid
    {
        padding: 0px 22px;
    }
    .content-top-grid-title h3
    {
        font-size: 1.5em;
    }
    .content-top-grid-title h3
    {
        margin-top: 0.4em;
    }
    .service-content ul li span
    {
        width: 8%;
    }
    .service-content ul li p
    {
        width: 91.5%;
    }
}
@media only screen and (max-width: 768px) and (min-width: 640px)
{
    .wrap
    {
        width: 90%;
    }
    .footer-grid
    {
        padding: 0px 22px;
    }
    .content-top-grid-title h3
    {
        font-size: 1.5em;
    }
    .content-top-grid-title h3
    {
        margin-top: 0em;
        font-size: 1.2em;
    }
    .service-content ul li span
    {
        width: 8%;
    }
    .service-content ul li p
    {
        width: 91.5%;
    }
    .about-topgrid1, .about-histore, .about-services
    {
        margin: 0;
        float: none;
        width: 100%;
    }
    .footer-grid
    {
        width: 26%;
    }
    .images_1_of_3
    {
        width: 100%;
        float: none;
    }
    .images_1_of_3 p
    {
        width: 100%;
    }
    .grid_1_of_3
    {
        margin: 0%;
    }
    .footer-grid:nth-child(1)
    {
        display: none;
    }
    .top-nav li a
    {
        padding: 1em 2.4em;
    }
}

input[type="submit"]
{
    background: #007DAD;
    color: #fff;
    height:30px;
    border-radius: 10px;
    font-size:1em;
    border:none;
}

input[type="submit"]:hover
{
    background-color: #111;
    color: #fff;
}


